<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<style>
    #jbrContent .btn-danger{
        position: absolute;
        left: 55px;
    }
</style>
<form:form commandName="taskNew" cssClass="form-horizontal" role="form">
    <div class="form-group">
        <label class="col-sm-2 control-label no-padding-right">任务名称</label>
        <div class="col-sm-8">
            <input type="text" value="${taskNew.taskName}" class="form-control" readonly>
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label no-padding-right">任务内容</label>
        <div class="col-sm-8">
            <textarea rows="5" class="form-control" readonly>${taskNew.content}</textarea>
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label no-padding-right">任务附件</label>
        <c:if test="${empty taskNew.file}">
            <div class="col-sm-3">
                <input type="text" value="无任务附件" class="form-control" readonly>
            </div>
        </c:if>
        <c:if test="${!empty taskNew.file}">
            <div class="col-sm-2">
                <input type="button" value="下载" onclick="downDetail('${taskNew.file}')" style="width: 100%; height: 32px;"
                       class="btn-large btn-primary"/>
            </div>
        </c:if>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label no-padding-right">责任领导</label>
        <div class="col-sm-3">
            <input type="text" value="${taskNew.leader}" class="form-control" readonly>
        </div>
        <label class="col-sm-2 control-label no-padding-right">任务时限</label>
        <div class="col-sm-3">
            <input type="text" value="${taskNew.dateTime}" class="form-control" readonly/>
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label no-padding-right">督查人</label>
        <div class="col-sm-3">
            <input type="text" value="${taskNew.operator}" class="form-control" readonly>
        </div>
        <label class="col-sm-2 control-label no-padding-right">督查人电话</label>
        <div class="col-sm-3">
            <input type="text" value="${taskNew.operatorTel}" class="form-control" readonly>
        </div>
    </div>
    <div class="form-group" style="position: relative;">
        <label class="col-sm-2 control-label no-padding-right">文号</label>
        <div class="col-sm-3">
            <input type="text" value="${taskNew.referenceNumber}" class="form-control" readonly>
        </div>
        <label class="col-sm-2 control-label no-padding-right">事项类型</label>
        <div class="col-sm-3">
            <c:if test="${taskNew.categoryId == '01'}">
                <input type="text" value="会议纪要" class="form-control" readonly>
            </c:if>
            <c:if test="${taskNew.categoryId == '02'}">
                <input type="text" value="省市县为民办实事" class="form-control" readonly>
            </c:if>
            <c:if test="${taskNew.categoryId == '03'}">
                <input type="text" value="省市县政府工作报告" class="form-control" readonly>
            </c:if>
            <c:if test="${taskNew.categoryId == '04'}">
                <input type="text" value="政协提案办理" class="form-control" readonly>
            </c:if>
            <c:if test="${taskNew.categoryId == '05'}">
                <input type="text"  value="县长批示件" class="form-control" readonly>
            </c:if>
            <c:if test="${taskNew.categoryId == '06'}">
                <input type="text"  value="人大建议办理" class="form-control" readonly>
            </c:if>
            <c:if test="${taskNew.categoryId == '07'}">
                <input type="text"  value="其他事项" class="form-control" readonly>
            </c:if>
        </div>
    </div>
    <%--会议纪要内容DIV--%>
    <div id="hyjyContent">
        <c:if test="${not empty sendList}">
            <c:forEach items="${sendList}" var="send">
                <div class="form-group">
                    <c:if test="${!empty send.remark}">
                        <label class="col-sm-2 control-label no-padding-right">议题</label>
                        <div class="col-sm-3">
                            <input type="text" value="${send.remark}" class="form-control" readonly>
                        </div>
                    </c:if>
                    <label class="col-sm-2 control-label no-padding-right">承办单位</label>
                    <div class="col-sm-3">
                        <input type="text" value="${send.departName}" class="form-control" readonly>
                    </div>
                </div>
                <c:if test="${!empty send.file}">
                    <div class="form-group">
                        <label class="col-sm-2 control-label no-padding-right">${send.departName}反馈附件</label>
                        <div class="col-sm-2">
                            <input type="button" value="下载" onclick="downDetail('${send.file}')" style="width: 100%; height: 32px;"
                                   class="btn-large btn-primary"/>
                        </div>
                    </div>
                </c:if>
                <c:if test="${!empty send.feedback}">
                    <div class="form-group">
                        <label class="col-sm-2 control-label no-padding-right">${send.departName}反馈内容</label>
                        <div class="col-sm-8">
                            <textarea rows="2" class="form-control" readonly>${send.feedback}</textarea>
                        </div>
                    </div>
                </c:if>
            </c:forEach>
        </c:if>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label no-padding-right">单位经办人</label>
        <div class="col-sm-2">
            <input type="button" value="添加" style="width: 100%; height: 32px;" onclick="addUnitResponsible()"
                   class="btn-large btn-success"/>
        </div>
    </div>
    <%--单位经办人内容DIV--%>
    <div id="jbrContent"></div>

    <input type="hidden" name="sysId" value="${taskSendId}">
    <input type="hidden" name="taskId" value="${taskNew.sysId}">

</form:form>
<script src="<s:url value="/assets/js/chosen.jquery.js"></s:url>"></script>
<script src="<s:url value="/assets/js/ajaxfileupload.js"></s:url>"></script>
<script src="<s:url value="/assets/js/modal/modal.js"></s:url>"></script>

<script type="text/javascript">

    // 单位责任人手机号Map
    var mobileMap = new Map();

    // 单位经办人option字符串
    var operatorOption = '<option value="">点击选择</option>';

    // 单位经办人的index
    var jbrIndex = $("#jbrContent .form-group").length;

    $(function(){
        // 获取单位责任人
        getOperator();
    });

    //下载按钮
    function downDetail(id) {
        var url = "/filesUpload/download/" + id;
        window.open(url);
    }

    /**
     * 获取单位责任人
     */
    function getOperator() {
        $.ajax({
            type: "post",
            url: '/unitPersonnel/queryList',
            dataType: "json",
            success: function (data) {
                if (data == undefined || data == null) {
                    console.log("获取单位责任人为空");
                    return;
                }
                for (var i = 0; i < data.length; i++) {
                    var name = data[i].name;
                    var sysId = data[i].sysId;
                    var phone = data[i].phone;
                    operatorOption += '<option value="' + sysId + '">' + name + '</option>';
                    mobileMap.set(sysId, phone);
                }
            },
            error: function (jqXHR) {
                console.log("获取单位责任人失败");
            }
        });
    }

    /**
     * 增加单位经办人
     */
    function addUnitResponsible() {
        var operatorStr = 'list[' + jbrIndex + '].operator';
        var operatorIdStr = 'list[' + jbrIndex + '].operatorId';
        var operatorTelStr = 'list[' + jbrIndex + '].operatorTel';
        var remark = 'list[' + jbrIndex + '].remark';
        html = '<div class="form-group">\n' +
            '    <label class="col-sm-2 control-label no-padding-right" for="' + remark + '">议题</label>\n' +
            '    <div class="col-sm-2">\n' +
            '        <input type="text" name="' + remark + '"   id="' + remark + '" placeholder="请输入议题" \n' +
            '               class="form-control" />\n' +
            '    </div>\n' +
            '    <label class="col-sm-2 control-label no-padding-right" for="' + operatorIdStr + '">单位经办人</label>\n' +
            '    <div class="col-sm-2">\n' +
            '        <select name="' + operatorIdStr + '" id="' + operatorIdStr + '" class="form-control required" onchange="changeOperator(this)">\n' + operatorOption +
            '        </select>\n' +
            '        <input type="hidden" name="' + operatorStr + '" id="' + operatorStr + '" />\n' +
            '    </div>\n' +
            '    <label class="col-sm-2 control-label no-padding-right" for="' + operatorTelStr + '">经办人电话</label>\n' +
            '    <div class="col-sm-2">\n' +
            '        <input type="text" name="' + operatorTelStr + '" data-id="' + operatorTelStr + '"  id="' + operatorTelStr + '" placeholder="经办人电话" \n' +
            '               class="form-control required" />\n' +
            '    </div>\n' +
            '   <button class="btn-danger btn-sm">删除</button>\n' +
            '</div>';
        $('#jbrContent').append(html);
        jbrIndex++;
    }

    /**
     * 删除会议纪要
     */
    $("#jbrContent").on("click", ".btn-danger", function () {
        $(this).parent().remove();
    });

    /**
     * 修改单位经办人,给隐藏框赋值
     */
    function changeOperator(obj) {
        var operatorName = $(obj).find("option ").text();
        if (operatorName == "点击选择") {
            $(obj).siblings("input").val('');
            $(obj).parent().next().next().children("input").val('');
        } else {
            $(obj).siblings("input").val(operatorName);
            var operatorId = $(obj).val();
            var mobile = mobileMap.get(operatorId);
            $(obj).parent().next().next().children("input").val(mobile);
        }
    }

</script>
